<template>
  <div class="betterscroll" ref="swiper">
    <div>
      <slot></slot>
    </div>
  </div>
</template>

<script>
import betterscroll from "better-scroll";
export default {
  name: "betterscroll",
  data() {
    return {
      scroll: null,
      count: 3
    };
  },
  mounted() {
    //这个方法就是里面直接写方法methods然后里面就是可执行的方法
    this.scroll = new betterscroll(this.$refs.swiper, {
      probeType: this.count,
      //probetype就是实时监听上划下滑的一个xy,只要是在滑动就会监听
      click: true,
      //click就是监听点击事件的打开
      pullUpLoad: true
    });
    //这个事件就是监听下拉的xy
    this.scroll.on("scroll", prication => {
      //console.log(prication);
      this.$emit("hiddimg", prication);
    });
    //这个事件就是 下拉加载更多，拉到最底下的时候才会加载
    this.scroll.on("pullingUp", () => {
      //console.log("下拉加载更多");
      this.$emit("pullingUp");
    });

    //this.$emit("clickbacktop",this.scroll);
  },
  methods: {
    batterscrollcli(x, y, time = 300) {
      if (this.scroll != null && this.scroll != undefined) {
        this.scroll.scrollTo(x, y, time);
      }
    },
    finishPullUp() {
      if (this.scroll != null && this.scroll != undefined) {
        this.scroll.finishPullUp();
      }
    },
    refreshimg() {
      console.log("我已经被刷新");
      if (this.scroll != null && this.scroll != undefined) {
        this.scroll.refresh();
      }
    }
  }
};
</script>

<style scoped>

</style>